<!DOCTYPE html>
<html lang="en">

<head>
	#include("./common/head.htm")
</head>

<body>
	#include("./common/header.htm")
	<div id="carouselBlk">
		<div id="myCarousel" class="carousel slide">
			<div class="carousel-inner">
				<div :class="index==0?'item active':'item'" v-for="(swiper,index) in getSwiperPic()">
					<div class="container">
						<a :href="'product_details.html?itemid='+swiper.itemid"><img style="width:80%;height: 450px;" :src="swiper.src"
								alt="special offers" /></a>
						<div class="carousel-caption">
							<h4>Second Thumbnail label</h4>
							<p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi
								porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.
							</p>
						</div>
					</div>
				</div>
			</div>
			<a class="left carousel-control" href="#myCarousel" data-slide="prev">&lsaquo;</a>
			<a class="right carousel-control" href="#myCarousel" data-slide="next">&rsaquo;</a>
		</div>
	</div>
	<div id="mainBody">
		<div class="container">
			<div class="row">
				#include("./common/sidebar.htm")
				<div class="span9" id="span9">
					<div class="well well-small">
						<h4 id="sub-title">热门商品 <small class="pull-right">热卖中...</small></h4>
						<div class="row-fluid">
							<div id="featured" class="carousel slide">
								<div class="carousel-inner">
									<div :class="page==0?'item active':'item'" v-for="page in pages">
										<ul class="thumbnails">
											<li class="span3" v-for="item in getPopularItems(page)" >
												<div class="thumbnail">
													<i class="tag"></i>
													<a :href="'product_details.html?itemid='+item.id"><img
															:src="item.src"
															alt=""></a>
													<div class="caption">
														<h5 id="test" style="white-space: nowrap;overflow: hidden;text-emphasis: ellipsis" :title="item.description">{{ item.description }}</h5>
														<h4><a class="btn" :href="'product_details.html?itemid='+item.id">查看</a>
															<span class="pull-right">{{ item.price.toFixed(2) }}元</span>
														</h4>
														<h5>销量：{{ item.sales }}</h5>
													</div>
												</div>
											</li>
										</ul>
									</div>
								</div>
								<a class="left carousel-control" href="#featured" data-slide="prev">‹</a>
								<a class="right carousel-control" href="#featured" data-slide="next">›</a>
							</div>
						</div>
					</div>
					<h4>最新上市 </h4>
					<ul class="thumbnails">
						<li class="span3" v-for="item in getNewItems()" >
							<div class="thumbnail">
								<a :href="'product_details.html?itemid='+item.id"><img :src="item.src"
										alt="" /></a>
								<div class="caption">
									<h5 style="white-space: nowrap;overflow: hidden;text-emphasis: ellipsis" :title="item.description">{{ item.description }}</h5>
									<h4 style="text-align:center"><a class="btn" :href="'product_details.html?itemid='+item.id"> <i
												class="icon-zoom-in"></i></a> <button class="btn" @click="addToCart(item.id)">加入 <i
												class="icon-shopping-cart"></i></button> <a class="btn btn-primary"
											href="#">{{ item.price.toFixed(2) }}元</a></h4>
								</div>
							</div>
						</li>
					</ul>

				</div>
			</div>
		</div>
	</div>
	<!-- MainBody End ============================= -->
	<!-- <%= require('./common/footer.htm') %> -->
	#include("./common/footer.htm")
</body>

</html>